<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>微商城</title>
<meta content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" name="viewport">
<meta name="format-detection" content="telephone=no">
<link href="__STATIC__/hotel/css/public.css" rel="stylesheet">
<link href="__STATIC__/hotel/css/style.css" rel="stylesheet">
<script type="text/javascript" src="__STATIC__/notime/js/laydate.js"></script>
</head>
<body>
<div id="mini_3">
	
    <div class="section">
    	<div class="show_img">
	    	<img src="__STATIC__/hotel/images/show_img.png" alt="">
	    </div>
	    <div class="packageNum">
    		<span class="lf"><b>{$info.name}</b><br>￥<i class="totalPrice">{$info.price}</i><i class="totalPriceMax"> ~ {$max}</i></span>
    		<div class="room_number rt">
    			<span class="plus">+</span>
    			<input class="print" type="text" value="1">
    			<span class="minus">-</span>
    		</div>
    	</div>
    	<div class="manyList">
    		<!-- 库存 -->
	    	<ul>
	    		<li>库存</li>
	    		<li>x<span>{$info.rest}</span></li>
	    	</ul>
	    	<!-- 规格 -->
	    	<ul class="openPop">
	    		<li>规格</li>
	    		<li><i class="format" id='norms' value='{$info.extra}'>{$info.norms}</i><img src="__STATIC__/hotel/images/right.png" alt=""></li>
	    	</ul>
	    	<!-- 领取时间 -->
	    	<ul>
	    		<li style="width:30%">领取时间</li>
	    		
                <li style="width:60%;text-align:right;"><input placeholder="请选择日期" class="laydate-icon time" onClick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})"></li>
	    	</ul>
    	</div>
    	<div class="productDetail">
    		<span>商品描述</span>
    		<div class="detailCont"><?php echo htmlspecialchars_decode($info['detail']);?></div>
    	</div>
    </div>
    <input type='hidden' id='foodid' value='{$info.id}'>
    <input type='hidden' id='kindid' value='{$info.kindid}'>
    <input type='hidden' id='perPrice' value='{$info.price}' >
    <input type='hidden' id='normss' >
    <input type='hidden' id='mount'>
    <a  class="quickBuy" onclick='buy()'>立即购买</a>
</div>
<!-- 选规格、购买数量 -->
<div class="popWindow flow">
	<div>
		<div class="product">
			<div class="product_img lf">
				<img src="__STATIC__/hotel/images/product_img.png" alt="">
			</div>
			<div class="product_detail">
				<p>{$info.name}</p>
				<p>￥<span class='totalPrice'>{$info.price}</span><i>库存<span>{$info.rest}</span>件</i></p>
			</div>
			<a href="javascript:void(0)" class="closePop">
				<img src="__STATIC__/hotel/images/close.png" alt="">
			</a>
		</div>
		<div class="standard">
			<p>规格</p>
			<div class="norm">
                <if condition="$info.norms neq null">
                    <span>{$info['norms']}</span>
                </if>
				<if condition="$info.norms1 neq null">
                    <span>{$info['norms1']}</span>
                </if>
                <if condition="$info.norms2 neq null">
                    <span>{$info['norms2']}</span>
                </if>
                <if condition="$info.norms3 neq null">
                    <span>{$info['norms3']}</span>
                </if>
                <if condition="$info.norms4 neq null">
                    <span>{$info['norms4']}</span>
                </if>
				
			</div>
		</div>
		<div class="room_price">
    		<span>购买数量</span>
    		<div class="room_number rt">
    			<span class="plus">+</span>
    			<input class="print" type="text" value="1">
    			<span class="minus">-</span>
    		</div>
    	</div>
        <input type='hidden' value='{$info.id}' class='iff'>
    	<a href="javascript:void(0)" class="nextTo">下一步</a>
	</div>
</div>
</body>
<script src="__STATIC__/hotel/js/jquery.js"></script>
<script type="text/javascript">
    $(function(){
        // 动态获取section的高
		var height=$(window).height()-$('.header').outerHeight(true)-$('.quickBuy').outerHeight(true);
	    $('.section').css('height',height);

	    // 规格对应
	    var format=$('.format').html();
	    var spans=$('.norm span');
	    for(var i=0;i<spans.length;i++){
	    	if($(spans[i]).html()==format){
	    		$(spans[i]).addClass('active');
	    	}
	    }
	    // 选规格
	    $('.norm>span').click(function(event) {
	    	if(!$(this).hasClass('active')){
	    		$(this).addClass('active').siblings('span').removeClass('active');
	    		// 替换尺寸
	    		var size=$(this).html();
	    		$('.format').html(size);
	    	}
            var norms = $('#norms').html();
            var foodid = $('.iff').val();
            $.ajax({
                url:"http://game.guangjixinxi.com/JinLingHotel/Mobile/Food/getNormsByAjax",
                type:'GET',
                dataType:'json',
                data:{norms:norms,foodid:foodid},
                success:function(res){
                    var perPrice=parseFloat(res.perPrice);
                     $('#perPrice').val(res.perPrice);
                    var value=parseFloat(res.val);
                     $('#normss').val(res.val);
                    var mount=parseFloat($('.print').val());
                    $('#mount').val(mount);
                    var totalPrice=(perPrice + value)*mount;
                    $('.totalPrice').html(totalPrice.toFixed(2));
                }
            });
            
	    });

	    // 打开关闭规格弹框
	    $('.openPop,.closePop').click(function(event) {
            // var numm = $('.print').val();//购买商品数
            // $('.print1').val(numm);
	    	$('.popWindow').toggle();
	    });
        $('.nextTo').click(function(event) {
            $('.popWindow').hide();
        });
	    //订单单价
        var unitPrice=$('.totalPrice').html();

        //房间数量增加
        $('.plus').click(function(event) {
            var perPrice = $('#perPrice').attr('value');
            var norms = $('#normss').val();
            if(norms == ''){
                norms = 0;
            }
            var val=$(this).siblings('input').val();
            val++;
            $('.print').attr('value',val);
            $('.print').val(val);
            // 订单总额
            $('.totalPrice').html(((parseInt(perPrice)+parseInt(norms))*val).toFixed(2));
            $('.totalPrice').html();
            $('.totalPriceMax').hide();
        });
        //房间数量减少
        $('.minus').click(function(event) {
            var perPrice = $('#perPrice').attr('value');
            var norms = $('#normss').val();
            if(norms == ''){
                norms = 0;
            }
            $('.totalPriceMax').hide();
            var val=$(this).siblings('input').val();
            val--;
            if(val<0){
                val=0;
            }
            $('.print').attr('value',val);
            $('.print').val(val);
            // 订单总额
            // $('.totalPrice').html(parseFloat(unitPrice*val).toFixed(2));
            $('.totalPrice').html(((parseInt(perPrice)+parseInt(norms))*val).toFixed(2));
            $('.totalPrice').html();
            $('.totalPriceMax').hide();
        
        });
        // input框内容改变
        $('.print').change(function(event) {
            var printCont=$(this).val();
            $('.print').attr('value',printCont);
            $('.print').val(printCont);
            // 订单总额
            $('.totalPrice').html(parseFloat(unitPrice*printCont).toFixed(2));
            // 明细
            $('.number').html($('.print').val());
        });
       
    });
</script>
</html>
<script type="text/javascript">
$('.nextTo').click(function(){

})
function buy(){
    var norms = $('#norms').html();
    var extra = $('#norms').attr('value');
    var totalPrice=$('.totalPrice').html();
    var lingqu_time = $('.time').val();
    var norm = $('.active').text();
// alert(norm);return false;
    if(totalPrice <= 0){
        alert('请选择商品数量');return false;
    }
    if(norm == ''){
        alert('请选择餐品规格');return false;
    }
    if(lingqu_time == ''){
        alert('请选择领取时间');return false;
    }
    var num = $('.print').val();
    var foodid = $('#foodid').val();
    location.href="{:U('Room/payFood')}?num="+num+"&totalPrice="+totalPrice+"&foodid="+foodid+"&lingqu_time="+lingqu_time+"&norms="+norms;
}
</script>
